import { ref } from 'vue';
import {
  recycleModelList,
  recyclePartsModelList,
  clearRecycleModel,
  clearPartsRecycleModel,
  deleteRecycleModel,
  restoreRecycleModel
} from '@/apis/pcf/myModel/modelList';
import type { IRecycleItem } from '@/apis/pcf/myModel/model/modelManage';
import { useMessage } from '@/hooks/useMessage';
import { debounce } from 'lodash';
import { useRecycle } from '../../useModelList';
import { useRoute } from 'vue-router';

export const useDetail = (emit: Fn) => {
  const { createMessage, createConfirm } = useMessage();
  const { recycleCount, loadRecycleCount } = useRecycle();

  const maxPage = ref(0); //最大页数
  const currentPage = ref(1);
  const recycleList = ref<IRecycleItem[]>([]);
  const scrollRef = ref();
  const hasMore = ref(true); // 触发加载更多
  const route = useRoute();
  const isFinishedAutomobileModel = route.name === 'MyModelList';

  const loadList = async (isLoadMore: boolean, isReset?: boolean) => {
    const params = {
      current: isReset ? 1 : currentPage.value,
      size: 20
    };
    const getListApi = isFinishedAutomobileModel ? recycleModelList : recyclePartsModelList;
    const data = await getListApi(params);
    maxPage.value = data.pages;
    if (isLoadMore) {
      recycleList.value = [...recycleList.value, ...data.records];
    } else {
      recycleList.value = data.records;
      scrollRef.value?.setScrollTop(0);
      if (isReset) {
        // 如果重置了就加载回收站数量
        loadRecycleCount();
      }
    }
  };
  const loadMore = () => {
    if (!hasMore.value) return;
    currentPage.value++;
    if (currentPage.value > maxPage.value) {
      hasMore.value = false;
    } else {
      hasMore.value = true;
      loadList(true);
    }
  };
  const scroll = (val: any) => {
    const scrollWrap = scrollRef.value?.wrapRef;
    console.log('scrollTop', scrollWrap.scrollHeight - val.scrollTop);
    console.log('scrollTop11', scrollWrap.clientHeight + 10);
    console.log('scrollTop11hasMore', hasMore.value);

    if (scrollWrap && scrollWrap.scrollHeight - val.scrollTop <= scrollWrap.clientHeight + 10) {
      // 滚动到底了
      loadMore();
    }
  };
  const handleClear = () => {
    // 清空回收站
    createConfirm('确认清空回收站？', '此操作无法撤销！', {
      iconType: 'warning'
    }).then(async () => {
      const clearApi = isFinishedAutomobileModel ? clearRecycleModel : clearPartsRecycleModel;
      await clearApi();
      createMessage.success(`回收站已清空！`);
      loadList(false, true);
      emit('refresh');
    });
  };
  const handleDel = (row: IRecycleItem) => {
    // 删除回收站
    createConfirm(
      '确认彻底删除模型？',
      '彻底删除模型后将无法在平台内引用模型数据，且无法恢复，建议谨慎删除。',
      {
        iconType: 'warning',
        confirmButtonText: '删除'
      }
    ).then(async () => {
      await deleteRecycleModel(row.modelNo);
      createMessage.success(`删除成功！`);
      loadList(false, true);
      emit('refresh');
    });
  };
  // 处理输入框改变事件
  const handleReset = debounce(async (row: IRecycleItem) => {
    await restoreRecycleModel(row.modelNo);
    createMessage.success(`恢复${row.modelName}成功！`);
    loadList(false, true);
    emit('refresh');
  }, 600);
  const init = () => {
    hasMore.value = true;
    currentPage.value = 1;
    loadList(false, true);
    scrollRef.value?.setScrollTop(0);
  };
  return {
    recycleList,
    scroll,
    scrollRef,
    loadList,
    handleClear,
    handleDel,
    handleReset,
    recycleCount,
    init
  };
};
